<template>
    <div>
        <div class="crumbs">
            <div class="contentbox">
                <div class="contentsize">事务办件-其他审批</div>
                <div>
                    <el-button @click="cacelsubmitForm('ruleForm')">返回</el-button>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="addtitle">其他审批</div>
            <!-- 房屋接管表格 -->
            <table class="table-1">
                <!-- 三行三列的表格 -->
                <tr>
                    <td colspan="4" style="font-weight: 700; padding: 10px; font-size: 20px">其他审批</td>
                </tr>
                <tr style="background-color: #f5fafa">
                    <td style="text-align: right; font-weight: 700; color: #000">房屋地址:</td>
                    <td colspan="3">
                        <el-select
                            v-model="form.processtableInfo.buildid"
                            placeholder="请选择房屋地址"
                            style="width: 100%"
                            @change="getbuildval"
                            filterable
                        >
                            <el-option v-for="item in lzlist" :key="item.fwdz" :label="item.fwdz" :value="item.id"> </el-option>
                        </el-select>
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right; font-weight: 700; color: #000; width: 14%">档案号:</td>
                    <td style="width: 36%">
                        {{ form.processtableInfo.dabh }}
                    </td>
                    <td style="text-align: right; font-weight: 700; color: #000; width: 14%">产权单位:</td>
                    <td style="width: 36%">
                        {{ form.processtableInfo.cqdw }}
                    </td>
                </tr>
                <tr style="background-color: #f5fafa">
                    <td style="text-align: right; font-weight: 700; color: #000">建筑面积:</td>
                    <td>
                        {{ form.processtableInfo.jzmj }}
                    </td>
                    <td style="text-align: right; font-weight: 700; color: #000">现使用状态:</td>
                    <td>
                        {{ form.processtableInfo.glfs }}
                    </td>
                </tr>
                <template v-if="form.processtableInfo.glfs == '出租经营'">
                    <tr>
                        <td style="text-align: right; font-weight: 700; color: #000">承租人:</td>
                        <td>
                            {{ form.processtableInfo.czr }}
                        </td>
                        <td style="text-align: right; font-weight: 700; color: #000">租赁用途:</td>
                        <td>
                            {{ form.processtableInfo.zlyt }}
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align: right; font-weight: 700; color: #000">合同编号:</td>
                        <td>
                            {{ form.processtableInfo.htbh }}
                        </td>
                        <td style="text-align: right; font-weight: 700; color: #000">签订时间:</td>
                        <td>
                            {{ form.processtableInfo.qdsj }}
                        </td>
                    </tr>
                    <tr style="background-color: #f5fafa">
                        <td style="text-align: right; font-weight: 700; color: #000">月租金:</td>
                        <td>
                            {{ form.processtableInfo.zjdj ? form.processtableInfo.zjdj + '元/月' : '' }}
                        </td>
                        <td style="text-align: right; font-weight: 700; color: #000">合同金额:</td>
                        <td>
                            {{ form.processtableInfo.htje }}
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align: right; font-weight: 700; color: #000">租赁起始时间:</td>
                        <td>
                            {{
                                form.processtableInfo.zlqssj
                                    ? (form.processtableInfo.zlqssj = form.processtableInfo.zlqssj.split(' ')[0])
                                    : (form.processtableInfo.zlqssj = '')
                            }}
                        </td>
                        <td style="text-align: right; font-weight: 700; color: #000">租赁到期时间:</td>
                        <td>
                            {{
                                form.processtableInfo.zldqsj
                                    ? (form.processtableInfo.zldqsj = form.processtableInfo.zldqsj.split(' ')[0])
                                    : (form.processtableInfo.zldqsj = '')
                            }}
                        </td>
                    </tr>
                </template>
                <tr v-else>
                    <td style="text-align: right; font-weight: 700; color: #000" colspan="1">现使用人:</td>
                    <td colspan="1">
                        {{ form.processtableInfo.xsyr }}
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right; font-weight: 700; color: #000" colspan="1">经办人签字:</td>
                    <td colspan="1">
                        <el-input v-model="form.processtableInfo.jbrqz" placeholder="请输入经办人签字" class="search-input"></el-input>
                    </td>
                    <td colspan="2" style="text-align: left"><el-button size="mini" type="danger" @click="gotoyaojian">要件</el-button></td>
                </tr>
                <!-- <tr>
                    <td style="text-align: right; font-weight: 700; color: #000">中心党委会纪要编号:</td>
                    <td colspan="3">
                        <el-input
                            v-model="form.processtableInfo.jybh"
                            placeholder="请输入中心党委会纪要编号"
                            class="search-input"
                        ></el-input>
                    </td>
                </tr> -->
                <tr style="background-color: #f5fafa">
                    <td style="text-align: right; font-weight: 700; color: #000">拟审批事项:</td>
                    <td colspan="3">
                        <el-input
                            v-model="form.processtableInfo.nspsx"
                            placeholder="请输入拟审批事项"
                            class="search-input"
                            type="textarea"
                            :autosize="{ minRows: 4 }"
                        ></el-input>
                    </td>
                </tr>
                <tr>
                    <td style="text-align: right; font-weight: 700; color: #000">报请原因:</td>
                    <td colspan="3">
                        <el-input
                            v-model="form.processtableInfo.bjsy"
                            placeholder="请输入报请原因"
                            type="textarea"
                            :autosize="{ minRows: 4 }"
                            class="search-input"
                        ></el-input>
                    </td>
                </tr>
                <tr>
                    <td colspan="4">
                        <el-button size="mini" type="primary" @click="qdclick" :disabled="isSubmit">启动</el-button>
                        <el-button size="mini" @click="cacelsubmitForm('ruleForm')">返回</el-button>
                    </td>
                </tr>
            </table>
        </div>
        <el-dialog title="文件" :visible.sync="yjshow" :modal-append-to-body="false" width="80%">
            <el-form ref="yjform" :model="yjform" label-width="auto" :inline="true">
                <el-form-item label="文件类型:" prop="yjlx">
                    <el-cascader
                        :options="yjlxlist"
                        :show-all-levels="false"
                        v-model="yjlx"
                        placeholder="请选择文件类型"
                        :props="{ checkStrictly: true }"
                        clearable
                    ></el-cascader>
                    <!-- <el-select v-model="yjform.yjlx" placeholder="请选择文件类型" style="width: 100%;">
                        <el-option v-for="item in yjlxlist" :key="item.code" :label="item.name" :value="item.code">
                        </el-option>
                    </el-select> -->
                </el-form-item>
                <el-form-item label="文件名称:" prop="yjbz">
                    <el-input placeholder="请输入文件名称" v-model="yjform.yjbz" style="width: 100%"></el-input>
                </el-form-item>
                <el-form-item label="是否需要盖章:" prop="sfgz">
                    <el-select v-model="yjform.sfgz" placeholder="请选择是否需要盖章" style="width: 100%" clearable>
                        <el-option v-for="item in sflist" :key="item.code" :label="item.name" :value="item.code"> </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="盖章类型:" prop="gzlx">
                    <el-select v-model="yjform.gzlx" placeholder="请选择盖章类型" style="width: 100%" clearable>
                        <el-option v-for="item in gzlxlist" :key="item.code" :label="item.name" :value="item.code"> </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitnopic">新增</el-button>
                </el-form-item>
                <el-upload
                    class="upload-demo"
                    :action="httpUrl + '/file/uploadFile'"
                    :on-remove="handleRemoves"
                    :before-remove="beforeRemoves"
                    multiple
                    :on-success="handelfilesuccess"
                    :headers="myHeaders"
                    :file-list="filefileList"
                >
                    <div class="unloadTitle">附件</div>
                    <el-button size="small" icon="el-icon-upload2">上传文件</el-button>
                </el-upload>
            </el-form>
            <div style="width: 220px; margin: auto">
                <el-button type="primary" @click="submitForm" v-if="fileLists.length != 0">上传</el-button>
                <el-button @click="yjshow = false">关闭</el-button>
            </div>
            <el-table :data="yjtableData" style="width: 100%; margin: 30px auto 0" border>
                <el-table-column prop="yjlx" label="文件类别" align="center"></el-table-column>
                <el-table-column prop="wjmc" label="文件" align="center">
                    <template slot-scope="scope">
                        <div v-if="scope.row.fj">
                            <router-link
                                target="_blank"
                                :to="{ path: '/perviewfile', query: { id: scope.row.fj, type: scope.row.suffix } }"
                                style="color: #008a94"
                                v-if="
                                    scope.row.suffix == '.docx' ||
                                    scope.row.suffix == '.doc' ||
                                    scope.row.suffix == '.xls' ||
                                    scope.row.suffix == '.xlsx'
                                "
                                >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i>
                            </router-link>
                            <el-button type="text" size="small" @click="redownload(scope.row.fj, scope.row.wjmc, scope.row.suffix)" v-else
                                >{{ scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i
                            ></el-button>
                        </div>
                        <span v-else>{{ scope.row.wjmc }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="sfgz" label="是否需要盖章" align="center"> </el-table-column>
                <el-table-column prop="gzlx" label="盖章类型" align="center"> </el-table-column>
                <el-table-column prop="yjbz" label="文件名称" align="center"> </el-table-column>
                <el-table-column label="操作" width="100" align="center">
                    <template slot-scope="scope">
                        <el-button type="text" size="small" @click.native.prevent="deleteRow(scope.$index, yjtableData)" style="color: red"
                            >删除</el-button
                        >
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>
    </div>
</template>
<script>
import { lcstart, download, buildlist, getbuilddetailbydabh, wtdwlist, builddetail, redownload, getbuildinfo } from '@/api/index';
import fileType from '../vo/filetype';
import valueList from '@/components/common/valueList.vue';
import global from '@/components/common/httpurl.vue';
export default {
    name: 'qtspstart',
    data() {
        return {
            yjlx: [],
            isSubmit: false,
            yjlxlist: valueList.yjlxlist, //是否列表
            yjdeepcolor: null,
            yjshow: false, //文件弹框
            yjform: { yjbz: null, yjlx: null, gzlx: null, sfgz: null }, //文件表单
            jgxslist: valueList.jgxslist, //接管形式
            qslist: valueList.qslist, //区属列表
            fwytlist: valueList.fwytlist, //房屋性质
            cblist: valueList.cblist, //产别
            cqdwlist: valueList.cqdwlist, //产权单位
            sflist: valueList.sflist, //是否列表
            gzlxlist: valueList.gzlxlist, //盖章类型
            myHeaders: {
                token: localStorage.getItem('token')
            },
            filefileList: [],
            httpUrl: global.httpUrl, //公共地址
            form: {
                clyj: '', // 处理意见 ,
                fileList: [], // 流程文件信息 ,
                // processcode: 'qtjy', // 流程编码 ,qtjy其他经营
                processcode: 'jlbqtsh', // 流程编码  type 1经理部  2经租部,
                processtableInfo: {
                    bjsy: '', // 办件事由 ,
                    caseid: '', // 流程实例id ,
                    cb: '', // 产别 ,
                    cqdw: '', // 产权单位 ,
                    create_name: '', // 创建人 ,
                    create_name_id: '', // 创建人id ,
                    create_time: '', // 创建时间 ,
                    dabh: '', // 档案编号 ,
                    dz: '', // 地址 ,
                    fwyt: '', // 房屋性质 ,
                    gzwjmc: '', // 盖章文件名称 ,
                    id: '', // id ,
                    jbrqz: '', // 经办人签字 ,
                    jgxs: '', // 接管形式 ,
                    qs: '', // 区属 ,
                    sfzbj: '', // 是否转办件 ,
                    status_code: '1', // 1正常 2删除 ,
                    update_name: '', // 修改人 ,
                    update_name_id: '', // 修改人id ,
                    update_time: '', // 修改时间,
                    stdqsj: '', // 受托到期时间 ,
                    stqssj: '', //受托起始时间 ,
                    stqx: '0', // 受托期限 ,
                    str: '', // 受托人 ,
                    zjfcbl: '', // 租金分成比例 ,
                    czr: '', //承租人
                    zlyt: '', //租赁用途
                    zjdj: '', //租金单价
                    zlqx: '', //租赁期限
                    xsyr: '', //现使用人
                    htbh: '',
                    qdsj: '',
                    htje: '',
                    zlqssj: '',
                    zldqsj: '',
                    glfs:''
                }, // 流程表单信息 ,
                userid: this.$store.getters.userId // 用户id
            },
            fileList: [],
            fileType: fileType,
            yjtableData: [],
            yjlist: [
                '同意',
                '不同意',
                '同意，请认真办理！',
                '不同意，请认真复核！',
                '拟同意，请领导批示！',
                '请办公室盖章！',
                '已盖章',
                '已办理，请归档！'
            ],
            fileLists: [], //文件列表
            bmlist: [], //部门列表
            lzform: {
                cb: '',
                cqdw: '',
                create_name: '',
                create_name_id: '',
                create_time: '',
                current: 1,
                czr: '',
                dabh: '',
                dqsj: '', //合同到期时间 ,
                fwdz: '', //地址 ,
                id: '',
                jzmj: '', //建筑面积 ,
                pageSize: 999, //每页数量 ,
                qs: '', //区属 ,
                signid: '',
                status_code: '1',
                type: this.$store.getters.type, //分类 1:房屋 2：楼栋 ,
                update_name: '',
                update_name_id: '',
                update_time: '',
                yzj: '',
                fczt: '1',
                fgy: this.$store.getters.role == '10011' ? this.$store.getters.userId : ''
            },
            lzlist: [], //楼幢列表,
            wtdwlists: [], //委托单位
            wtdwform: {
                create_time: '', //创建时间 ,
                current: 1, //第几页 ,
                dwbh: '', //单位编号 ,
                dwmc: '', //单位名称 ,
                id: '', //id ,
                lxdh: '', // 联系电话 ,
                lxr: '', //联系人 ,
                pageSize: 999, //每页数量 ,
                status_code: 1, //1正常 2删除
                tght: '', //托管合同 ,
                yyzz: '' //营业执照
            }
        };
    },
    methods: {
        // 计算两个时间
        calculateMonthDifference(startDate, endDate) {
            const start = new Date(startDate);
            const end = new Date(endDate);

            const startYear = start.getFullYear();
            const startMonth = start.getMonth();
            const endYear = end.getFullYear();
            const endMonth = end.getMonth();

            let yearDifference = endYear - startYear;
            let monthDifference = endMonth - startMonth;

            // 如果结束月份小于开始月份，则需要减去一年
            if (monthDifference < 0) {
                yearDifference--;
                monthDifference += 12;
            }
            this.form.processtableInfo.zlqx = yearDifference * 12 + monthDifference;
            // return yearDifference * 12 + monthDifference;
        },
        // 下载文件
        downloadfile(id, name, type) {
            console.log(id);
            let filetype = fileType[type];
            let data = {
                fileid: id
            };
            download(data).then((res) => {
                const link = document.createElement('a');
                let blob = new Blob([res], {
                    type: filetype
                });
                link.style.display = 'none';
                //设置连接
                link.href = URL.createObjectURL(blob);
                link.download = name;
                document.body.appendChild(link);
                //模拟点击事件
                link.click();
                console.log(res);
            });
        },
        // 文件
        handleRemoves(file, fileList) {
            console.log(fileList);
            this.fileLists = fileLists;
        },
        // 文件删除前
        beforeRemoves(file, fileList) {
            console.log(file);
            console.log(fileList);
            return this.$confirm(`确定移除 ${file.name}？`);
        },
        // 上传成功
        handelfilesuccess(response, file, fileLists) {
            console.log(fileLists);
            this.fileLists = fileLists;
            this.$message.success('导入成功');
        },
        // 获取到每一个意见值
        getYjVal(val, i) {
            this.yjdeepcolor = i;
            console.log(val);
            this.form.clyj = val;
        },
        // 取消
        cacelsubmitForm() {
            this.$router.go(-1);
        },
        // 文件弹框
        gotoyaojian() {
            this.yjshow = true;
        },
        // 删除
        deleteRow(index, rows) {
            this.$confirm('确定删除此条文件吗？')
                .then(() => {
                    rows.splice(index, 1);
                })
                .catch(() => {
                    this.$message.success('删除取消');
                });
        },
        // 上传功能
        submitForm() {
            if (this.yjlx) {
                //this.yjform.yjlx=this.yjform.yjlx.pop();
                var lastItem = this.yjlx[this.yjlx.length - 1];
                this.yjform.yjlx = lastItem;
            } else {
                this.$message.error('请选择文件类型');
                return;
            }
            console.log('yjlx', this.yjform.yjlx);
            console.log('yjbz', this.yjform.yjbz);
            console.log('fileLists', this.fileLists);
            // 类型 suffix
            let yjlb = this.fileLists.map((res) => {
                return {
                    caseid: '', // 流程实例id ,
                    create_name: '', //创建人 ,
                    create_name_id: '', //创建人id ,
                    create_time: '', //创建时间 ,
                    fj: res.response.data.id, //附件
                    id: '', // id ,
                    status_code: '1', // 1正常 2删除 ,
                    update_name: '', // 修改人 ,
                    update_name_id: '', //修改人id ,
                    update_time: '', //修改时间 ,
                    wjmc: res.response.data.filename, //文件名称 ,
                    yjbz: this.yjform.yjbz, //文件名称 ,
                    yjlx: this.yjform.yjlx, //文件类型
                    sfgz: this.yjform.sfgz, //是否需要盖章
                    gzlx: this.yjform.gzlx, //盖章类型
                    suffix: res.response.data.suffix //附件
                };
            });
            console.log('yjlb', yjlb);
            this.yjtableData = this.yjtableData.concat(yjlb);
            this.yjform.yjlx = null;
            this.yjform.yjbz = null;
            this.yjform.sfgz = null;
            this.yjform.gzlx = null;
            this.yjlx = null;
            this.filefileList = [];
            this.fileLists = [];
        },
        // 上传功能（不包含文件）
        submitnopic() {
            if (this.yjlx) {
                var lastItem = this.yjlx[this.yjlx.length - 1];
                this.yjform.yjlx = lastItem;
                //this.yjform.yjlx=this.yjform.yjlx.pop();
            } else {
                this.$message.error('请选择文件类型');
                return;
            }
            let yjlb = [
                {
                    caseid: '', // 流程实例id ,
                    create_name: '', //创建人 ,
                    create_name_id: '', //创建人id ,
                    create_time: '', //创建时间 ,
                    fj: '', //附件
                    id: '', // id ,
                    status_code: '1', // 1正常 2删除 ,
                    update_name: '', // 修改人 ,
                    update_name_id: '', //修改人id ,
                    update_time: '', //修改时间 ,
                    wjmc: this.yjform.yjbz, //文件名称 ,
                    yjbz: this.yjform.yjbz, //文件名称 ,
                    yjlx: this.yjform.yjlx, //文件类型
                    sfgz: this.yjform.sfgz, //是否需要盖章
                    gzlx: this.yjform.gzlx, //盖章类型
                    suffix: '' //附件
                }
            ];
            this.yjtableData = this.yjtableData.concat(yjlb);
            this.yjform.yjlx = null;
            this.yjform.yjbz = null;
            this.yjform.sfgz = null;
            this.yjform.gzlx = null;
            this.yjlx = null;
            // this.filefileList = [];
            // this.fileLists = [];
        },
        // 流程启动接口
        lcstart(data) {
            lcstart(data).then((res) => {
                if (res.code == 200) {
                    this.$message.success('已启动流程');
                    this.isSubmit = false;
                    this.$router.go(-1);
                }
            });
        },
        // 启动流程按钮
        qdclick() {
            this.form.fileList = this.yjtableData;
            console.log('form', this.form);
            this.isSubmit = true;
            this.lcstart(this.form);
        },
        // 楼幢列表
        buildlist(data) {
            buildlist(data).then((res) => {
                if (res.code == 200) {
                    this.lzlist = res.data.records;
                } else {
                    this.lzlist = [];
                }
            });
        },
        // 获取楼幢信息
        getbuildval(val) {
            console.log('楼幢详情', val);
            let data = {
                id: val
            };
            builddetail(data).then((res) => {
                this.form.processtableInfo.dabh = res.data.dabh;
                this.form.processtableInfo.cqdw = res.data.cqdw;
                this.form.processtableInfo.dz = res.data.fwdz;
                this.form.processtableInfo.fwyt = res.data.fwyt;
                this.form.processtableInfo.jzmj = res.data.jzmj;
                this.form.processtableInfo.buildid = res.data.id;
                this.form.processtableInfo.glfs = res.data.glfs;
                let data1 = {
                    buildid: res.data.id
                };
                getbuildinfo(data1).then((item) => {
                    this.form.processtableInfo.czr = item.data.czr;
                    this.form.processtableInfo.zlyt = item.data.zlyt;
                    this.form.processtableInfo.htbh = item.data.htbh;
                    this.form.processtableInfo.qdsj = item.data.qdsj;
                    this.form.processtableInfo.zjdj = item.data.zjdj;
                    this.form.processtableInfo.htje = item.data.htje;
                    this.form.processtableInfo.zlqssj = item.data.zlqssj;
                    this.form.processtableInfo.zldqsj = item.data.zldqsj;
                    this.form.processtableInfo.xsyr = item.data.xsyr;
                    console.log(item.data.xsyr);
                });
            });

            // getbuilddetailbydabh(data).then(res => {
            //     console.log(res)
            //     this.form.processtableInfo.dabh = res.data.dabh
            //     this.form.processtableInfo.cqdw = res.data.cqdw
            //     this.form.processtableInfo.dz = res.data.fwdz
            //     this.form.processtableInfo.fwyt = res.data.fwyt
            //     this.form.processtableInfo.jzmj = res.data.jzmj
            //     this.form.processtableInfo.buildid = res.data.id
            // })
        },
        // 委托单位列表
        wtdwlist(data) {
            wtdwlist(data).then((res) => {
                if (res.code == 200) {
                    this.wtdwlists = res.data.records;
                }
            });
        },
        // 文件预览
        redownload(id, name, type) {
            let filetype = fileType[type];
            let data = {
                fileid: id
            };
            redownload(data).then((res) => {
                console.log(res);
                let blob = new Blob([res], {
                    type: filetype
                });
                let url = window.URL.createObjectURL(blob);
                window.open(url, '_blank');
            });
        }
    },
    mounted() {
        this.buildlist(this.lzform);
        this.wtdwlist(this.wtdwform);
    }
};
</script>
<style>
.el-upload-list {
    width: 60%;
}

.el-upload--text {
    width: auto;
    height: 80px;
    overflow: hidden;
    border: none;
}
</style>
<style scoped>
/* 选择意见 */
.xzyj {
    width: 48%;
    height: 110px;
    overflow-y: scroll;
    overflow-x: hidden;
    border: 1px solid #dcdfe6;
    border-radius: 4px;
    padding: 10px 0;
    box-sizing: border-box;
}

.xzyj .xzyjitem {
    text-align: left;
    cursor: pointer;
    line-height: 24px;
}

table {
    width: 70%;
    margin: auto;
    text-align: center;
}

.table-1 {
    border: 1px solid #c0c0c0;
    border-collapse: collapse;
    /*合并相邻表格的间距*/
}

.table-1 tr,
.table-1 td {
    font-size: 13px;
    border-collapse: collapse;
    border: 1px solid #c0c0c0;
    padding: 10px;
    box-sizing: border-box;
    color: #606266;
}

.container {
    overflow: hidden;
}

.crumbs {
    background-color: #fff;
    padding: 20px 20px;
}

.indexTitle {
    margin-bottom: 20px;
}

.contentbox {
    display: flex;
    justify-content: space-between;
}

.contentsize {
    font-size: 18px;
    font-weight: 700;
    line-height: 32px;
    color: #606266;
}

.handle-box {
    overflow: hidden;
}

.addtitle {
    width: 100%;
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 20px;
    box-sizing: border-box;
    margin-bottom: 20px;
    font-weight: 700;
}

.buttonCenter {
    width: 12%;
    margin: auto;
}

.unloadTitle {
    text-align: left;
    padding-bottom: 10px;
    box-sizing: border-box;
    color: #606266;
}

/* 搜索按钮 */
.searchcolor {
    background-color: #7090ff;
}

.detailcontent {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.detailcontent .detailitem {
    /* float: left; */
    width: 33%;
    margin-bottom: 30px;
}

.detailcontent .detailitem1 {
    /* float: left; */
    width: 99%;
    margin-bottom: 30px;
    font-weight: 700;
    color: #008a94;
}

.detailcontent .detailitem2 {
    /* float: left; */
    width: 99%;
    margin-bottom: 30px;
}

/* 项目文件 */
.filebox {
    text-align: center;
    margin-right: 10px;
    cursor: pointer;
}

.fileboxitem:hover {
    color: #7090ff;
}

.deleteitem {
    color: red;
}

.deleteitem:hover {
    color: #eeeeee;
}
</style>